<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="jquery-1.10.2.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$('#userid').blur(
			function(){
				var len = $(this).val().length ;
				if (len <4 || len > 16){
					$('#userid_msg').text('帳號長度不符合');
				}
			}
		);
		$('#pw1').blur(
			function(){
				var len = $(this).val().length ;
				if (len <4 || len > 20){
					$('#pw1_msg').text('密碼長度不符合');
				}
			}
		);
		$('#pw2').keyup(
			function(){
				var pw1 = $('#pw1').val();
				if (pw1!= $(this).val()){
					$('#pw2_msg').text('密碼不相同');
				}else{
					$('#pw2_msg').text('OK');
				}
			}
		);
		
	});

</script>
<title>Insert title here</title>
</head>
<body>
<form action="">
  帳號:<input id="userid" name="userid" type="text" value="jack"/><span id="userid_msg"></span>
<br/>
  密碼:<input id="pw1" name="pw1" type="text" value="1234"/> <span id="pw1_msg"></span>
<br/>
  密碼:<input id="pw2" name="pw2" type="text" value="1234"/><span id="pw2_msg">(請再輸入一次密碼)</span>
<br/>
  E-mail:<input name="email" type="text" value="test@com.tw"/>
<br/>
  <input type="submit" value="註冊"/>
</form>
</body>
</html>





